How to Close the Popup Window Displaying a Component Embedded in an a5w Page

Description

Normally, a child component is opened directly in a popup window. If the component is embedded in an .a5w page, however, that is opened in a popup, the component will be run in an IFrame. Traditional methods, such as the 'closeContainerWindow()' JavaScript method cannot be used to close the container window. This article explains what you must do in order to close the popup window from the child component.

Discussion

A component opened in a popup window can be closed using Action Javascript - Hide/Close a window - or a component method - closeContainerWindow(). If the component is embedded in an .a5w page, however, and shown using the Open an .a5w page, static HTML page, URL, or PDF document, in a pop-up window or a DIV action, neither the Hide/Close a window action or closeContainerWindow() component method can be used. To explain why the method cannot be used and how to close the popup window, consider the following scenario:

The user has a button on a Grid or UX that opens an .a5w page in a window. The .a5w page has a UX or Grid on it. The user puts a button on the child component (that is running in the .a5w page) to close the window.

Because the window contains an .a5w page, the .a5w page runs in an IFrame. Therefore, the child component's javascript context is not the same as the parent component's context.

Here is what the button in the child component must do in order to close the window:

1. First, the button that opens the window must also execute this code:

window.__objname = {dialog.object};

or, if the button that opens the window is in a Grid

window.__objname = {grid.object};

This stores a reference to the parent object in a global Javascript variable called __objname.

2. Next, the button that open the window MUST give the window an explicit name (do not use <Default>). For example: 'CHILDWINDOW'

3. Finally, in the child component, here is the code to close the window that contains the .a5w page. Place this code in a button or link in the child component:

var win = window.parent.__objname.getWindow('ChildWindow');
if(win) win.hide();

See Also